<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>元素的获取</title>
</head>
<body>
    <div id="div1">div1</div>
    <div id="div2">div2</div>
    <div class="cls">div3</div>
    <div class="cls">div4</div>
    <input type="text" name="username">
</body>
<script>
    // getElementById() 根据id属性值获取元素对象
    let div1 = document.getElementById("div1");
    alert(div1);

    // getElementByTagName() 根据元素名称获取元素对象，返回数组
    let divs = document.getElementsByTagName("div");
    alert(divs.length);

    // getElementByClassName() 根据Class属性值获取元素对象，返回数组
    let clss = document.getElementsByClassName("cls");
    alert(clss.length);

    // getElementByName() 根据Name属性值获取元素对象，返回数组
    let name = document.getElementsByName("username");
    alert(name.length)
    
    // 子元素对象.parentElement属性 获取当前元素的父元素
    let parentElement = div1.parentElement;
    alert(parentElement);
</script>
</html>